<template>
    <div class='priDialog'>
        <el-dialog width="60vw" 
        :title="name"
        center
        :showClose='false' 
        @closed="changeShow"  
        @close="changeShow" 
        :visible.sync="dialogFormVisible">
            <div class='content'>
                <!-- <h2 style="text-align: center; ">{{name}}</h2> -->
                <div v-html="content"></div>
            </div>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="changeShow">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
export default {
    props: ['item', 'dialogFormVisible'],
    data() {
        return {
            name: '',
            content: '',
        }
    },
    watch: {
        item(newVal) {           
            this.name = newVal.name,
            this.content = newVal.content
            //  console.log(newVal, this.name, this.content)
        }
    },
    methods: {
        changeShow() {
            this.$emit('changeShow')
        },
    }
}

</script>
<style scoped lang='less'>
.content {
    // background-color: rgb(208, 245, 248); 001E69 0068B5
    border: 1px solid #0068B5;
    border-radius: 10px;
    padding: 15px;
}
</style>
<style lang='less'>
.priDialog {
    .el-dialog__header {
        // background-color: rgb(190, 226, 250);
        font-size: 20px;
        padding-top: 30px;;
    }
    .el-dialog__title {
        font-weight: bold;
        color: #333;
    }
    .el-dialog__title::before,
    .el-dialog__title::after {
        // border-bottom: 2px solid #001E69;
        // padding: 0 10px 5px 10px;
        content: '——';
        display: inline-block;
        padding: 0 5px;
    }
    
}
</style>